document.addEventListener('DOMContentLoaded', function() {
    // 初始化视频列表
    initVideoList();
    
    // 初始化分类导航
    initVideoNav();
    
    // 初始化视频播放功能
    initVideoPlay();
    
    // 初始化搜索功能
    initVideoSearch();
});

// 初始化视频列表
function initVideoList() {
    const videoGrid = document.querySelector('.zheng_video_grid');
    const videos = videoData.recommend;
    
    videoGrid.innerHTML = '';
    
    videos.forEach(video => {
        const videoElement = createVideoElement(video);
        videoGrid.appendChild(videoElement);
    });
}

// 创建视频卡片元素
function createVideoElement(video) {
    const div = document.createElement('div');
    div.className = 'zheng_video_card';
    div.innerHTML = `
        <div class="zheng_video_cover">
            <img src="${video.coverUrl}" alt="${video.title}">
            <span class="zheng_video_duration">${video.duration}</span>
        </div>
        <div class="zheng_video_info">
            <h3 class="zheng_video_title">${video.title}</h3>
            <div class="zheng_video_meta">
                <span class="zheng_author">${video.author}</span>
                <span class="zheng_play_count">${video.playCount}播放</span>
            </div>
        </div>
    `;
    
    // 添加点击播放功能
    div.addEventListener('click', () => {
        playVideo(video);
    });
    
    return div;
}

// 视频播放功能
function playVideo(video) {
    // 创建视频播放弹窗
    const modal = document.createElement('div');
    modal.className = 'zheng_video_modal';
    modal.innerHTML = `
        <div class="zheng_video_player">
            <div class="zheng_video_header">
                <span class="zheng_video_title">${video.title}</span>
                <span class="zheng_close_btn">&times;</span>
            </div>
            <video src="./videos/${video.id}.mp4" controls></video>
        </div>
    `;
    
    document.body.appendChild(modal);
    
    // 关闭按钮功能
    modal.querySelector('.zheng_close_btn').addEventListener('click', () => {
        document.body.removeChild(modal);
    });
}

// 初始化分类导航
function initVideoNav() {
    const navItems = document.querySelectorAll('.zheng_scroll_wrapper li');
    
    navItems.forEach(item => {
        item.addEventListener('click', function() {
            navItems.forEach(nav => nav.classList.remove('active'));
            this.classList.add('active');
            
            const category = this.textContent.trim();
            loadVideosByCategory(category);
        });
    });
}

// 根据分类加载视频
function loadVideosByCategory(category) {
    const videos = category === '推荐' ? videoData.recommend :
                  category === '直播' ? videoData.live :
                  category === '游戏' ? videoData.game :
                  videoData.recommend;
    
    const videoGrid = document.querySelector('.zheng_video_grid');
    videoGrid.innerHTML = '';
    
    videos.forEach(video => {
        const videoElement = createVideoElement(video);
        videoGrid.appendChild(videoElement);
    });
}

// 初始化视频搜索
function initVideoSearch() {
    const searchInput = document.querySelector('.zheng_search input');
    
    searchInput.addEventListener('input', function() {
        const keyword = this.value.trim().toLowerCase();
        if (keyword) {
            searchVideos(keyword);
        } else {
            initVideoList();
        }
    });
}

// 搜索视频
function searchVideos(keyword) {
    const allVideos = [
        ...videoData.recommend,
        ...videoData.live,
        ...videoData.game
    ];
    
    const filteredVideos = allVideos.filter(video => 
        video.title.toLowerCase().includes(keyword) ||
        video.author.toLowerCase().includes(keyword)
    );
    
    const videoGrid = document.querySelector('.zheng_video_grid');
    videoGrid.innerHTML = '';
    
    if (filteredVideos.length > 0) {
        filteredVideos.forEach(video => {
            const videoElement = createVideoElement(video);
            videoGrid.appendChild(videoElement);
        });
    } else {
        videoGrid.innerHTML = '<div class="zheng_empty_result">没有找到相关视频</div>';
    }
} 